<template>
  <view class="content">
    <view
      v-if="payList.length > 0"
      style="background-color: #f5f5f5; height: 1rpx"
    ></view>
    <view class="boxItem" v-if="payList.length > 0">
      <view class="payitem">
        <span class="title">日期：</span>
        <span class="key">{{ pay.yearmonth }}</span>
      </view>
      <view class="payitem">
        <span class="title">姓名：</span>
        <span class="key">{{ pay.name }}</span>
      </view>
      <view class="payitem">
        <span class="title">用户工号：</span>
        <span class="key">{{ pay.user_sn }}</span>
      </view>
      <view v-for="item in payList" :key="item" class="payitem">
        <span class="title">{{ item.title }}：</span>
        <span class="key">{{ item.value }}</span>
      </view>
    </view>
    <u-empty
      v-if="payList.length == 0"
      mode="data"
      icon="http://cdn.uviewui.com/uview/empty/data.png"
    />
  </view>
</template>

<script>
export default {
  name: "tab-1",
  data() {
    return {
      pic: this.$IMG_URL,
      pay: {},
      payList: [],
    };
  },
  onLoad() {
    this.getGongzitiao();
  },
  methods: {
    async getGongzitiao() {
      const data = await this.http.get("gongzitiao/index");
      this.pay = data.data;
      this.payList = JSON.parse(data.data?.detail);
      this.payList.map((item) => {
        if (item.title.indexOf("天") != -1) {
          item.value += " 天";
        } else if (item.title.indexOf("时") != -1) {
          item.value += " 小时";
        } else if (item.title == "备注") {
			
        } else {
          item.value += " 元";
        }
      });
      console.log(this.payList, "this.payList");
    },
  },
};
</script>
<style lang="scss" scoped>
image {
  width: 100%;
  display: block;
}
.payitem {
  display: flex;
  justify-content: space-between;
  padding-bottom: 20rpx;
  .title {
    width: 250rpx;
  }
  .key {
    width: 200rpx;
  }
}
</style>